@extends('pc_admin.app')

@section('content')
<link rel="stylesheet" href="/css/pc-system/attendance-left.css">
<link rel="stylesheet" href="/css/pc-system/buy-vip.css">
<div class="mian-container">
    <div class="container-section">
        <div class="f-left left-section">
            <div class="title-list top-list ">
                <h3 class="h3-title"><a href="{{url('/company-vip')}}"><i class="icon iconfont icon-xiangqing"></i>会员详情</a></h3>
            </div>
            <div class="title-list top-list active">
                <h3 class="h3-title"><a href="{{url('/buy-vip')}}"><i class="icon iconfont icon-feiyong"></i>会员续费</a></h3>
            </div>
            <div class="title-list top-list">
                <h3 class="h3-title"><a href="{{url('/company-vip')}}"><i class="icon iconfont icon-gouwuche"></i>购买记录</a></h3>
            </div>
            <div class="title-list top-list">
                <h3 class="h3-title"><a href="{{url('/company-vip')}}"><i class="icon iconfont icon-doubt-circle"></i>企业VIP说明</a></h3>
            </div>
        </div>
        <div class="right-section">
            <form class="buy-vip" method="post" action="/wechat_native_pay">
                <div class="weui-cells user-show">
                    <div class="weui-cell">
                        <div class="weui-cell__hd"><img  src={{"/uploads/images/company-logo/".$user->corpid.".png"}}></div>
                        <div class="weui-cell__bd">
                            <p>{{$user->qw_name}}</p>
                        </div>
                        <div class="weui-cell__ft">{{$company->expire_at}} 会员到期</div>
                    </div>
                </div>
                <p class="title-p">1.开通企业VIP</p>
                <div class="weui-flex kind-cost">
                    <div class="weui-flex__item">
                        <div class="box-border">
                            <img class="buy-car" src="/img/buy-car.png">
                            <i class="icon iconfont icon-queren active"></i>
                            <p><span data-price="1">888</span>元/年</p>
                            {{--<img src="/img/line.png">--}}
                            <p class="thin-p">标准版50人使用</p>
                        </div>
                    </div>
                    <div class="weui-flex__item">
                        <div class="box-border">
                            <i class="icon iconfont icon-queren"></i>
                            <p><span data-price="2">1888</span>元/年</p>
                            <p class="thin-p">标准版150人使用</p>
                        </div>
                    </div>
                    <div class="weui-flex__item">
                        <div class="box-border">
                            <i class="icon iconfont icon-queren"></i>
                            <p><span data-price="3">2888</span>元/年</p>
                            <p class="thin-p">标准版350人使用</p>
                        </div>
                    </div>
                </div>
                <input type="hidden" value="{{$user->id}}" name="user_id">
                <input type="hidden" value="{{$user->corpid}}" name="corpid">
                <input type="hidden" value="" name="price">
                <input type="hidden" value="" name="detail">
                <input type="hidden" value="" name="name">
                <p class="sum-up">应付金额：<span>888</span>元</p>
                <p class="title-p">2.选择支付方式</p>
                <div class="weui-cells pay-way">
                    <div class="weui-cell">
                        <div class="weui-cell__hd"><img src="/img/wechat.png"></div>
                        <div class="weui-cell__bd">
                            <p>微信</p>
                        </div>
                        <div class="weui-cell__ft">
                            <i class="icon iconfont icon-queren active"></i>
                        </div>
                    </div>
                </div>
                <button type="submit" class="right-pay">立即支付</button>
            </form>
        </div>
    </div>
</div>
<script>
    $(document).ready(function () {
        if($('.left-section').height()<$('.right-section').height()){
            $('.left-section').css('min-height',$('.right-section').height())
        }else{
            $('.right-section').css('min-height',$('.left-section').height());
        }
        $('.box-border').each(function () {
            var that=this
            if($(that).find('i').hasClass('active')){
                $('input[name="price"]').val($(that).find('span').attr('data-price'));
                $('input[name="detail"]').val($(that).find('.thin-p').text());
                $('input[name="name"]').val($(that).find('span').text()+'元/年');
            }
        })
        $('.box-border').click(function () {
            $(this).parent().siblings().find('.icon-queren').removeClass('active');
            $(this).find('.icon-queren').addClass('active');
            $('input[name="price"]').val($(this).find('span').attr('data-price'));
            $('input[name="detail"]').val($(this).find('.thin-p').text());
            $('input[name="name"]').val($(this).find('span').text()+'元/年');
            $('.sum-up span').text($(this).find('span').text())
        })
        $('.pay-way').click(function () {
            $(this).find('i').toggleClass('active');
        })
//        数据提交
        $('.right-pay').click(function () {
            if(!$('.pay-way i').hasClass('active')){
                layer.msg("请选择付款方式");
                return false;
            }
            if($('input[name="price"]').val()==''||$('input[name="detail"]').val()==''||$('input[name="name"]').val()==''){
                layer.msg("操作失败，请重试！", {icon: 2});
                return false;
            }
        })
    })
</script>
@endsection
